function gid(id) {
	return document.getElementById(id);
}
var a = 1;
var mycolor = new Array('#5500ff', '#55aa00', '#00aaff', '#0055ff', '#ff0000', '#c28100', '#00007f', '#55ff7f',
	'#ff5964', '#ba6aff');

function add() {
	var i = gid('in').value;
	var h = gid('h').value;
	var w = gid('w').value;
	var icm = i * 2.54;
	var icm = icm * icm;
	var y = (Number(h) * Number(h)) + (Number(w) * Number(w));
	var x = icm / y;
	var k = Math.sqrt(x)
	var wk = k * h;
	var hk = k * w
	gid('box').innerHTML += '<div id=' + a + ' onclick="zindexs(this)"></div>';
	gid('show').innerHTML += '<p onclick="del(this)" id=' + 'xx' + a + '>■' + i + '寸　长:' + wk.toFixed(3) + 'cm　宽:' + hk
		.toFixed(3) + 'cm　■点我删除■</p>';
	gid(a).style.width = wk * 10 + 'px';
	gid(a).style.height = hk * 10 + 'px';
	gid(a).style.position = 'absolute';
	gid(a).style.top = '25%';
	var z = Math.floor(Math.random() * 10);
	gid(a).style.border = '2px solid' + mycolor[z];
	gid(a).style.backgroundColor = mycolor[z];
	gid('xx' + a).style.color = mycolor[z];
	amove(a);
	a++;
}

function del(e) {
	var id = e.id;
	var id = id.substr(-1, 1)
	e.remove();
	gid(id).remove();
}

function img() {
	var fh = gid('fh').value;
	var fw = gid('fw').value;
	var x = gid("box");
	var divs = x.getElementsByTagName("div");
	for (var i = 0; i < divs.length; i++) {
		gid(i + 1).innerHTML = '<img draggable="false" src="https://picsum.photos/' + fw + '/' + fh + '?random=1"/>';
	}
}

function move(a) {
	var divMove = document.getElementById(a)
	if (divMove == null) return;
	divMove.onmousedown = function(e) {
		var ev = e || window.event;
		var distanceX = ev.clientX - divMove.offsetLeft;
		var distanceY = ev.clientY - divMove.offsetTop;
		document.onmousemove = function(e) {
			var ev = e || window.event;
			divMove.style.left = ev.clientX - distanceX + 'px';
			divMove.style.top = ev.clientY - distanceY + 'px';
		};
		document.onmouseup = function() {
			document.onmousemove = null;
			document.onmouseup = null;
		};
	};
}

function amove(a) {
	var div = gid('box').getElementsByTagName('div')
	for (var i = 0; i < div.length; i++) {
		move(i + 1);
	}
}

function zindexs(e) {
	amove(a)
	var div = gid('box').getElementsByTagName('div')
	for (var i = 0; i < div.length; i++) {
		var a= div[i].id;
		gid(a).style.zIndex = i - 1;
		e.style.zIndex = i;
	}
}
function bug(){
	var div = gid('box').getElementsByTagName('div')
	for (var i = 0; i < div.length; i++) {
		var a= div[i].id;
		move(a);
	}
}
document.οncοntextmenu = function() {
	return false;
};
document.onselectstart = function() {
	return false;
};
